/**
 * MenuToggle
 * @authors 杨兴洲（of2502）
 * @date    2017/5/31 0031 16:49
 * @version 1.0
 * @last-modify  杨兴洲（of2502）
 */

import React, {Component} from 'react';
import {Relax} from 'iflux2';
import {Switch, Button, message, Modal} from 'antd';
import GaUtil from "util/ga-util";

@Relax
export default class MenuToggle extends Component {
    static defaultProps = {
        isActive: true,
        toggleMenu: () => void 0,
        deleteMenu: () => void 0
    };

    render() {
        const {isActive, deleteMenu} = this.props;
        return (
            <div className="tips">
                <i className="tips-icon anticon anticon-exclamation-circle"></i>
                <div className="tips-content" style={{flex: 1}}>
                    <p>由于微信接口延迟，菜单修改后最长可能需要30分钟才会更新。</p>
                    <p>如需及时查看，可先取消关注公众号，再重新关注。</p>
                    <a href="http://help.qianmi.com/hc/kb/article/1055871/" target="_blank" style={{marginLeft: -5}}>【自定义菜单】操作向导</a>
                </div>
                <Button style={{margin: 10}} type="primary"
                        onClick={this.deleteMenu}>删除菜单</Button>
                {/*<Switch style={{margin: 10}} defaultChecked={isActive} onChange={() => toggleMenu(!isActive)}/>*/}
            </div>
        )
    }

    deleteMenu = () => {
        const _this = this;
        Modal.confirm({
            title: `是否确定删除菜单?`,
            content: "删除后数据将被清空,不可恢复!",
            onOk() {
                _this.props.deleteMenu()
                    .then(() => message.success('删除菜单成功'));
                GaUtil.addEvent({eventAction: "删除菜单", eventLabel: "自定义菜单"})
            }
        });
    }
}